import { TemplateDetailPage } from "./../template-detail/template-detail.page";
import { BluetoothPrinterService } from "./../../services/bluetooth-printer.service";
import { TemplateAddPage } from "../template-add/template-add.page";
import { Component, OnInit } from "@angular/core";
import {
	ToastController,
	ModalController,
	ViewWillEnter,
} from "@ionic/angular";
import { Global } from "src/app/services/global.service";
import { LocalStorage } from "src/app/services/local-storage.service";
import { ChooseLanguagePage } from "../choose-language/choose-language.page";
import { SelectDevicePage } from "../select-device/select-device.page";
import { SettingsPage } from "../settings/settings.page";
import { TemplateConfig } from "src/app/services/print.const";
import { InAppBrowser } from "@ionic-native/in-app-browser/ngx";

@Component({
	selector: "app-home",
	templateUrl: "home.page.html",
	styleUrls: ["home.page.scss"],
})
export class HomePage implements OnInit, ViewWillEnter {
	currentRewardInfo: any;
	connectedDevice: any;
	items: TemplateConfig[];

	constructor(
		private toastCtrl: ToastController,
		private modalCtrl: ModalController,
		private global: Global,
		private localStorage: LocalStorage,
		private iab: InAppBrowser,
		private bps: BluetoothPrinterService
	) {
		this.connectedDevice = {};
		this.items = [];
	}

	ionViewWillEnter(): void {
		this.items = this.global.templates;
	}

	ngOnInit(): void {
		this.initLanguage();
		setInterval(async () => {
			this.connectedDevice = this.bps.getDevice();
		}, 500);
	}

	initLanguage() {
		const language = this.localStorage.getData(Global.LANGUAGE);
		if (!language) {
			this.chooseLanguage();
		}
	}

	removeTemplate(index: number) {
		this.global.removeTemplate(index);
		this.items = this.global.templates;
	}

	async addTemplate() {
		const modal = await this.modalCtrl.create({
			swipeToClose: true,
			presentingElement: await this.modalCtrl.getTop(),
			component: TemplateAddPage,
		});

		modal.onDidDismiss().then(() => {
			this.items = this.global.templates;
		});

		await modal.present();
	}

	async templateDatail(config: TemplateConfig) {
		const modal = await this.modalCtrl.create({
			swipeToClose: true,
			presentingElement: await this.modalCtrl.getTop(),
			component: TemplateDetailPage,
			componentProps: {
				config,
			},
		});

		await modal.present();
	}

	async connectDevice() {
		const modal = await this.modalCtrl.create({
			swipeToClose: true,
			presentingElement: await this.modalCtrl.getTop(),
			component: SelectDevicePage,
		});

		await modal.present();
	}

	async chooseLanguage() {
		const modal = await this.modalCtrl.create({
			swipeToClose: true,
			presentingElement: await this.modalCtrl.getTop(),
			component: ChooseLanguagePage,
		});

		await modal.present();
	}

	private async toast(message: string) {
		const toast = await this.toastCtrl.create({
			message,
			duration: 3000,
		});
		await toast.present();
	}

	feedback() {
		const b = this.iab.create("https://support.qq.com/product/375997", "_system");
		b.show();
	}

	async settings() {
		const modal = await this.modalCtrl.create({
			swipeToClose: true,
			presentingElement: await this.modalCtrl.getTop(),
			component: SettingsPage,
		});

		await modal.present();
	}

	translate(key: string) {
		return this.global.translate(key);
	}
}
